<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>幻冰后台首页vbase版本-demo</title>
<link rel="stylesheet" type="text/css" href="https://res.kuoqps.com/kuoqi-ui/web.dev.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<script src="https://res.kuoqps.com/kuoqi-js/kq.1.06/kq.1.06.dev.js"></script>
</head>

<body>
<!--页面信息-->
<div class="container-fluid">
<div class="row">
  <div class="col-12">
    <div class="card card-cpanel">
      <div class="card-head"><span class="label label-small label-white">按钮列表</span></div>
      <div class="card-body">
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-index">主按钮</button>
                <button class="btn btn-small btn-index-hollow">主按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-index】颜色是根据主色系进行搭配的按钮，用得最多的按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-add">增加按钮</button>
                <button class="btn btn-small btn-add-hollow">增加按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-add】增加的按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-ask">询问按钮</button>
                <button class="btn btn-small btn-ask-hollow">询问按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-ask】询问按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-del">删除按钮</button>
                <button class="btn btn-small btn-del-hollow">删除按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-del】删除按钮颜色信息</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-edit">编辑按钮</button>
                <button class="btn btn-small btn-edit-hollow">编辑按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-edit】编辑按钮颜色信息</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-login">登入按钮</button>
                <button class="btn btn-small btn-login-hollow">登入按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-login】登入按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-quit">登出按钮</button>
                <button class="btn btn-small btn-quit-hollow">登出按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-quit】登出按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-save">保存按钮</button>
                <button class="btn btn-small btn-save-hollow">保存按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-save】保存按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-submit">提交按钮</button>
                <button class="btn btn-small btn-submit-hollow">提交按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-submit】提交按钮</span></div>
        </div>
        <!---->
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-error">异常按钮</button>
                <button class="btn btn-small btn-error-hollow">异常按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-error】异常按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-success">成功按钮</button>
                <button class="btn btn-small btn-success-hollow">成功按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-success】成功按钮</span></div>
        </div>
        <div class="row-flex text-ch mgb-5">
        	<div class="col-auto">
            	<button class="btn btn-small btn-failed">失败按钮</button>
                <button class="btn btn-small btn-failed-hollow">失败按钮</button>
            </div>
            <div class="col-other"><span class="label label-small">【btn btn-failed】失败按钮</span></div>
        </div>
      </div>
    </div>
  </div>
</div>
<!--页面信息 end-->
</body>
<script src="https://res.kuoqps.com/kuoqi-ui/app.js"></script>
<script src="js/main.js"></script>
</html>
